/**
 * @author xuyh0817
 * @email xuyh0817@foxmail.com
 * @date 2022-02-22 01:23
 * @version 2.0.0
 * @doc todo
 * @website todo
 * @remark  如果要分发源码，需在本文件顶部保留此文件头信息！！
 */

export default function(code) {
  const date = Date.now()
  return `<template>
  <x-render-form
    ref="xRenderForm"
    v-model="formData"
    v-bind="formConfig"
    @form-submit="formSubmitHandler"
    @change="formChangeHandler"
    @form-change="formDataChangeHandler"
    @custom-event="customEventHandler"
  ></x-render-form>
</template>

<script>
export default {
  name: 'XRenderForm${date}',
  data() {
    return {
      // 表单数据
      formData: {}
    }
  },
  computed:{
      formConfig:{
        get(){
            return ${code}
        }
      }
  },
  methods: {
     /**
     *  表单提交事件
     * @param formData {Object} 表单数据
     */
    formSubmitHandler(formData){
        // todo ajax提交数据
    },
    /**
    *  表单发生变化事件
    * @param type {String} 组件类型
    * @param prop {String} 组件属性
    * @param value {[String|Number|Object|boolean]} 组件值
    * @param attrs {Object} 组件属性集合
    * @param formItem{Object} 属性集合
    */
    formChangeHandler({type,prop,value,attrs,formItem}){
        // todo 事件操作
        //  展示/隐藏表单项  this.$refs.xRenderForm.showComponents('prop','prop1') |  this.$refs.xRenderForm.hideComponents('prop','prop1')
        //  启用/禁用表单项  this.$refs.xRenderForm.enabledComponents('prop','prop1') |  this.$refs.xRenderForm.disabledComponents('prop','prop1')
    },
   /**
    * 表单数据发送变化事件
    * @param formData {Object} 表单数据
    */
    formDataChangeHandler(formData){
        // todo 事件操作
    },
   /**
    *  自定义事件统一处理
    * @param type {String} 组件类型
    * @param prop {String} 组件属性
    * @param value {[String|Number|Object|boolean]} 组件值
    * @param attrs {Object} 组件属性集合
    * @param formItem{Object} 属性集合
    * @param association{Object} 关联属性集合
    */
    customEventHandler({type,prop,value,attrs,formItem,association}){
          // todo 自定义事件操作
    }
  }
}
</script>
`
}
